<template>
  <div>
    <img v-show="!isShow" src="https://ss1.bdstatic.com/70cFvXSh_Q1YnxGkpoWK1HF6hhy/it/u=3744153253,2832238438&fm=26&gp=0.jpg" alt="">
    <el-container v-show="isShow">
      <el-header>
        <el-menu 
        :default-active="activeIndex" 
        class="el-menu-demo" 
        mode="horizontal"
        background-color="#545c64"
        text-color="#fff"
        router
        active-text-color="#ffd04b">
          <el-menu-item index="/main">处理中心</el-menu-item>
          <el-menu-item index="/work">我的工作台</el-menu-item>
          <el-menu-item index="/news">消息中心</el-menu-item>
          <el-menu-item index="/order">订单管理</el-menu-item>
          <el-menu-item>
            <el-button @click="exit">退出登录</el-button>
          </el-menu-item>
        </el-menu>
      </el-header>
      <div class="router_view">
        <router-view/>
      </div>
    </el-container>
  </div>
</template>

<script>
import echarts from "echarts"
export default {
  data(){
    return{
      xAxis:[],
      yAxis:[],
      activeIndex:'',
      isShow:true,
    }
  }, 
  methods:{
    exit(){
      localStorage.removeItem("token");
      this.isShow=false
      setTimeout(()=>{
        this.$router.push({path:"/login"})
      },3000)
    },
  }
}
</script>

<style scoped>
.el-container
{
  width: 100vw;
}

.el-header 
{
    background-color: #545c64;
    height: 8vh;
    display: inline-flex;
    justify-content: space-between;
    align-items: center;
}

.el-menu-vertical-demo:not(.el-menu--collapse) {
    width: 200px;
    min-height: 400px;
}

.router_view
{
  width: 100vw;
  /* border: 1px solid #000; */
  /* overflow: hidden; */
}

img
{
  width: 100vw;
  height: 100vh;
}
</style>